<template>
    <div class="head">
        自动模式
    </div>
    <div class="startset">
        <el-button type="primary" class="button" @click="configSet">模式启用</el-button>
   </div>
   
    <div class="setblock">
        <el-tabs v-model="activeName">
        <el-tab-pane label="策略一" name="first">
            <polic :number="1" class="tab-pan"  @child-message="receiveMessage"></polic>   
        </el-tab-pane>
        <el-tab-pane label="策略二" name="second">
            <polic :number="2" class="tab-pan" @child-message="receiveMessage"></polic>  
        </el-tab-pane>
        
        <el-tab-pane label="策略三" name="third">
            <polic :number="3" class="tab-pan" @child-message="receiveMessage"></polic>  
        </el-tab-pane>
        <el-tab-pane label="策略四" name="fourth">
            <polic :number="4" class="tab-pan" @child-message="receiveMessage"></polic>  
        </el-tab-pane>
        </el-tabs>
        
    </div>

    <div class="setblock">
      
    </div>
    <div class="setblock">

    </div>


 
</template>
<script lang="ts" setup >
import { ref,onMounted} from 'vue'
import    service   from '@/tools/request.ts'
import polic from '@/components/polic.vue'
const value = ref(false)
const yggl = ref(0)
const wggl = ref(0)
const  activeName = ref("first")
const  policmap = new Map()


let  senddata = {
    remote_adj_ctrl_table:[]
} 

function configSet(){
    senddata.remote_adj_ctrl_table=[]
    policmap.forEach((val,key)=>{
        senddata.remote_adj_ctrl_table.push(val)
    })
    service({
        url:'/v1/policy/set',
        method: 'post',
        data: senddata
    })
}

const handleSwitchChange=(val)=> {
      console.log('Switch value changed to:', val);
    }

function receiveMessage(msg,number){
    // senddata.remote_adj_ctrl_table[number] = msg
    policmap.set(number,msg)
    console.log(msg,number);
    
}
</script>
<style>
   
    .setblock{
        margin-top: 30px;
        margin-left: 50px;
    }
    .setblock .tags{
        width:100px;
        left: 100px;
 
        margin-right: 30px;
    }
    .setblock  span{
        margin-right: 10px;
    }
    .setblock .switch{
        margin-left: 30px
    }
    .head{
        text-align:center ;
        font-size: 40px;
        color:green
    }
    .startset{
        margin-top: 50px;
        margin-bottom: 100px;
        text-align: center;
    }
    .startset .button{
        height: 60px;
        font-size: 50px;
    }
    .tab-pan{
        width:100%
    }
</style>